30.显示评论和添加评论功能完成

（1）apps/models.py

class CommentModel(db.Model):    __tablename__='comment'    id=db.Column(db.Integer,primary_key=True,autoincrement=True)    content=db.Column(db.Text,nullable=False)    create_time=db.Column(db.DateTime,default=datetime.now)    post_id=db.Column(db.Integer,db.ForeignKey('post.id'))    author_id = db.Column(db.String(50), db.ForeignKey('front_user.id'), nullable=False)    post=db.relationship('PostModel',backref='comments')    author=db.relationship('FrontUser',backref='comments')

生成到数据库

python manage.py migratepython manage.py upgrade

（2）front/forms.py

class AddCommentForm(BaseForm):    content=StringField(validators=[InputRequired(message='请输入评论内容')])    post_id=IntegerField(validators=[InputRequired(message='请输入评论内容')])

（3）front/views.py

@bp.route('/acomment/',methods=['POST'])@login_requrieddef add_comment():    form=AddCommentForm(request.form)    if form.validate():        content=form.content.data        post_id=form.post_id.data        post=PostModel.query.get(post_id)        if post:            comment=CommentModel(content=content)            comment.post=post            comment.author=g.front_user            db.session.add(comment)            db.session.commit()            return restful.success()        else:            return restful.params_error(message='没有这个帖子')    else:        return restful.params_error(form.get_error())

（4）front/front_base.html

（5）front/front_pdetail.html

{% extends 'front/front_base.html' %}{% from 'common/_macros.html' import static %}{% block title %}    {
    { post.title }}{% endblock %}{% block head %}                
     {% endblock %}{% block body %}    
     
        
      
            
       
{
   { post.title }}
            
       
                发表时间:{
   { post.create_time }}                作者:{
   { post.author.username }}                版块:{
   { post.board.name }}                阅读数:{
   { post.read_count }}                评论数:0            
            
       
                        {
    { post.content|safe }}            
       
        
      
      
      
        
       
评论列表:
        
       
                    {% for comment in post.comments %}                
        
                
         
                    
                          
         
                
         
                    
          
 { { comment.author.username }} { { comment.create_time }} 
                    
          
 { { comment.content|safe }} 
                
         
                
            {% endfor %}        
       
    
      
    
      
        
       
添加评论
        
               
       
            
        发表评论        
       
    
      
    
     
    
     
{% endblock %}

（6）front/css/front_pdetail.css

.comment-group{
       border:1px solid #e8e8e8;    margin-top: 20px;    padding: 10px;}.add-comment-group{
       border:1px solid #e8e8e8;    margin-top: 20px;}.add_comment_btn{
       text-align: right;    margin: 10px;}.add-comment-group h3{
       margin: 10px;}.comment-list-group li{
       overflow:hidden;    border-bottom:1px solid #e8e8e8;}.avatar-group{
       float:left;}.avatar-group img{
       width: 50px;    height: 50px;    border-radius: 50%;}.comment-content{
       float: left;    margin-left: 20px;}.comment-content .author-info{
       font-size: 12px;    color:#8c8c8c;}.author-info span{
       margin-right:10px;}.comment-content .comment-txt{
       margin-top: 10px;}

（7）front/front_pdetail.js

$(function(){    var ue=UE.getEditor('editor',{        'serverUrl':'/ueditor/upload/',        "toolbars": [            [                'undo', //撤销                'redo', //重做                'bold', //加粗                'italic', //斜体                'blockquote', //引用                'selectall', //全选                'fontfamily', //字体                'fontsize', //字号                'simpleupload', //单图上传                'emotion' //表情            ]        ]    });    window.ue=ue;});$(function(){   $('#comment-btn').on('click',function(event){       event.preventDefault();       var login_tag=$('#login-tag').attr('data-is-login');       if (! login_tag){           window.location='/signin/'       }else{           var content=window.ue.getContent();           var post_id=$('#post-content').attr('data-id');           zlajax.post({              'url':'/acomment/' ,               'data':{                  'content':content,                   'post_id':post_id               },               'success':function(data){                  if(data['code']==200){                      zlalert.alertSuccessToast(msg='评论发表成功');                      window.location.reload();                  }else{                        zlalert.alertInfo(data['message']);                  }               }           });       }   }) ;});